<template>
    <div class="main">
        <!-- <div class="side">
            <div style="height:100vh">
                <div class="singlecheckout" @click="inbox('UNREAD')">
                    <span class="small">未读消息</span>
                    <i class="el-collapse-item__arrow el-icon-arrow-right"></i>
                </div>
                <div class="singlecheckout"  @click="inbox('READ')">
                    <span class="small">已读消息</span>
                    <i class="el-collapse-item__arrow el-icon-arrow-right"></i>
                </div>
                <div class="singlecheckout" >
                    <span class="small">发送消息</span>
                    <i class="el-collapse-item__arrow el-icon-arrow-right"></i>
                </div>
                <div class="singlecheckout" >
                    <span class="small">消息查询</span>
                    <i class="el-collapse-item__arrow el-icon-arrow-right"></i>
                </div>

            </div>
            
        </div> -->
        <keep-alive>
            <router-view  :infoData="info" v-if="$route.meta.keepAlive">

            </router-view>
        </keep-alive>

        <router-view  :infoData="info" v-if="!$route.meta.keepAlive">
        </router-view>

<!--        <keep-alive>-->
<!--            <router-view-->
<!--                    :infoData="info"-->
<!--            ></router-view>-->
<!--        </keep-alive>-->

 
    </div>
    
</template>
<script>
    import $ from "jquery";

    export default {
        data() {
            return {
                current: 1,
                size: 20,
                page: {},
                info: {},
                timer: null,
                key: 0,
                sideList:[],
                mode: "",
                single:{},
                active:["1"],
                defaultExpandedKeys:[],
                tableData: []
            }
        },
        watch: {
            
        },
        mounted() {
            console.log(this.$route.params.type)
            if(this.$route.params.type == 'mongo'){
                console.log('mongo版')
                // this.info = {
                //     type: 
                // }
                this.info.type = 'mongo'
                this.info.alread = "/message/alread"
                this.info.search = "/message/search"
                this.info.del = "/message/del"
                this.info.alreadyList = "/message/inbox"
                this.info.viewMsg = "/message/viewMsg"
                this.info.searchUser = "/user/searchUser"
                this.info.getType = "/message/returnType"
                this.info.send = "/message/sendMsg"
                this.info.upload = "/api/bpm/message/uploads"
                
            }
            else if(this.$route.params.type == 'normal' || this.$route.params.type == null){
                // console.log('db2')
                this.info.type = 'normal'
                this.info.alread = "/message/alreads" // 加s都不需要
                this.info.search = "/message/searchF"
                this.info.del = "/message/dels"
                this.info.alreadyList = "/message/inboxF"
                this.info.viewMsg = "/message/viewMsg"
                this.info.searchUser = "/user/searchUser"
                this.info.getType = "/message/returnType"
                this.info.send = "/message/sendMsg"
                this.info.upload = "/api/bpm/message/uploads"
                console.log(this.info)
            }
            //
            // this.load()
        },
        methods: {
            load() {

                this.loading()
                // $.get(this.info.getDList,{},Response => {
                //     if(Response.success){
                //         this.sideList = Response.data;
                //         if(this.sideList.length != 0){
                //             this.defaultExpandedKeys = [this.sideList[0].id]
                //             // console.log(this.defaultExpandedKeys)
                //         }
                //         console.log(this.sideList)

                //     }else{
                //         this.$message.error("失败");
                //     }
                //     this.loading(false)
                // })
            },
            inbox(R){
                if(R == 'READ'){
                    this.$router.push({path:"/message/"+ this.info.type+"/outbox",query:{"type":R}})

                }else{
                    this.$router.push({path:"/message/"+ this.info.type+"/inbox",query:{"type":R}})

                }
                // this.info.inbox = R
                // console.log(this.info.inbox)
            },
            loading(bool = true) {
                
                const loading = this.$loading({
                lock: true,
                text: '',
                spinner: 'el-icon-loading',
                background: 'rgba(255, 255, 255, 0.7)'
                });
                if(!bool){
                    loading.close();
                }
            }

        }
    }
</script>

<style scoped lang="less">
    .box {
        display: flex;
        flex-direction: column;
    }

    .page {
        text-align: right;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .main{
        display: flex;
        height:100%;
        .side{
            max-width:250px;
            width:18rem;
            overflow-y: auto;
            margin: 0 10px 0 10px;
            .worker{
                padding-left:20px
            }
        }
        .h100{
            width: 100%;
            // overflow: auto;
            padding:10px;
            box-sizing: border-box;

        }
    }
    .singlecheckout{
        height:48px;
        display:flex;
        align-items: center;
        cursor: pointer;
        border-bottom: 1px solid #EBEEF5;
        span{
            font-size: 13px;
        }
    }
</style>